<script setup>

import {onMounted, ref} from 'vue';
import {useStore} from "../pinia/index.js";
import {post} from "../util/request.js";
import {showToast} from "vant";

const showPopup = ref(false);
const comment = ref('');
const store = useStore()

const submitComment = () => {
  // 这里可以将 comment 的值发送到服务器
  console.log('评论内容:', comment.value);
  // 关闭弹窗
  post("course/submitComment",
      {courseId:store.currentCourse.courseId,
      content:comment.value
      }).then(res=>{
        if(res.code == 0){
          showToast("评论成功")
        }else{
          showToast("评论失败 : "+res.data)
        }
  })


  showPopup.value = false;
  // 清空评论内容
  comment.value = '';
};

onMounted(()=>{

})


</script>

<template>
  <div>
    <van-button type="primary" @click="showPopup = true">点击评价</van-button>
    <van-popup v-model:show="showPopup" position="bottom" round style="width: 90%">
      <div style="height: 40vh">
        <van-cell title="评价" is-link>
          <template #default>
            <van-field
                v-model="comment"
                placeholder="请输入评价内容"
                autosize
                rows="4"
                maxlength="200"
                show-word-limit
            />
          </template>
        </van-cell>
      </div>
      <van-button
          type="primary"
          block
          @click="submitComment"
          :disabled="comment.trim() === ''"
          style="margin-top: 10px"
      >
        发布
      </van-button>
    </van-popup>
  </div>

</template>

<style scoped>

</style>